<template>
  <j-modal
    :title="title"
    :width="width"
    :visible="visible"
    switchFullscreen
    @ok="handleOk"
    @cancel="handleCancel"
    cancelText="关闭">
    
    <a-form-model ref="form" :model="form" :rules="validatorRules">
      <a-row>
        <a-col :span="15">
          <a-form-model-item
            :labelCol="labelCol"
            :wrapperCol="wrapperCol"
            label="字典项"
            prop="dictItems"
            :rules="{
              required: true,
              message: '请选择字典项',
              trigger: 'change',
            }"
          >
            <a-select
              show-search
              allow-clear
              v-model="form.dictItems"
              style="width: 100%"
              placeholder="请选择字典项"
              :maxTagCount="2"
              mode="multiple"
              :getPopupContainer="
                (triggerNode) => {
                  return triggerNode.parentNode || document.body
                }
              "
            >
              <a-select-option v-for="item in dictItemList" :key="item.value" :value="item.value" :label="item.label" :title="item.title">
                {{ item.value+'-'+item.label }}
              </a-select-option>
            </a-select>
          </a-form-model-item>
        </a-col>
      </a-row>
      <a-table
        ref="table"
        size="middle"
        :scroll="{ x: true }"
        bordered
        rowKey="id"
        :columns="columns"
        :dataSource="dataSource"
        :pagination="ipagination"
        :loading="loading"
        class="j-table-force-nowrap"
        @change="handleTableChange"
      >
        
        <span slot="action" slot-scope="text, record">
          <a-popconfirm title="确定删除吗?" @confirm="() => removeDomain(record)">
            <a :style="{ marginLeft: '15px' }" > 删除 </a>
          </a-popconfirm>
        </span>
      </a-table>
    </a-form-model>
  </j-modal>
</template>

<script>
import { httpAction,getAction } from '@/api/manage'
import '@/assets/less/TableExpand.less'
import { mixinDevice } from '@/utils/mixin'
import { JeecgListMixin } from '@/mixins/JeecgListMixin'

  export default {
    name: 'ReportDictRelaForm',
    mixins:[JeecgListMixin, mixinDevice],
    components: {
      
    },
    data () {
      return {
        title:'',
        width:896,
        visible: false,
        disableSubmit: false,
        labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
        },
        wrapperCol: {
          xs: { span: 24 },
          sm: { span: 16 },
        },
        validatorRules: {
          
        },
        form: {dictItems: []},
        dictItemList: [],
        reporttypecode:'',
        confirmLoading: false,
        disableMixinCreated:true,
        columns:[
          // {
          //   title: '选项',
          //   dataIndex: '',
          //   key: 'rowIndex',
          //   width: 60,
          //   align: 'center',
          //   customRender: function (t, r, index) {
          //     return parseInt(index) + 1
          //   },
          // },
          {
            title: '码值',
            align: 'center',
            dataIndex: 'code',
            scopedSlots: { customRender: 'code' },
          },
          {
            title: '名称',
            align: 'center',
            dataIndex: 'name',
            scopedSlots: { customRender: 'name' },
          },
          // {
          //   title: '操作',
          //   align: 'center',
          //   dataIndex: 'action',
          //   scopedSlots: { customRender: 'action' },
          // },
        ],
        url: {
          list: '/reportForms/llbbReportForms/reportDictRelaList',
        },
      }
    },
    created() {
      //初始化字典项下拉框
      this.initDictItemList();
    },
    methods: {
      show (record) {
        //报表代码
        this.reporttypecode = record.reporttypecode;
        this.visible=true;
        this.queryParam.reportCode = record.reporttypecode;
        this.loadData();
      },
      close () {
        this.$emit('close');
        this.visible = false;
      },
      handleOk () {
        this.$refs.form.validate((valid) => {
          if (valid) {
            let dictItems = this.form.dictItems ? this.form.dictItems.join(',') : '';
            let params = {reportCode:this.reporttypecode,dictItems:dictItems};
            this.confirmLoading = true
            getAction('/reportForms/llbbReportForms/addReportDictRela',params).then((res) => {
              if (res.code === 200) {
                this.$message.success('添加成功');
                this.form = {};
                this.close();
              } else {
                this.confirmLoading = false
                this.$message.warning('服务器出错')
              }
            });
          } else {
            return false;
          }
        });
      },
      handleCancel () {
        this.close();
      },
      //初始化字典项
      initDictItemList() {
        getAction('/paramConfig/llbbParamConfig/queryDictItemList').then((res) => {
          if (res.success) {
            this.dictItemList = res.result.map((item, index, arr) => {
              let c = { label: item.name, value: item.code, id: item.code }
              return c
            })
          }
        })
      },
      
    }
  }
</script>